<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, pet-scalable=0">

    <title>添加入驻信息</title>

    <link href="../AmazeUI-2.4.2/assets/css/admin.css" rel="stylesheet" type="text/css">
    <link href="../AmazeUI-2.4.2/assets/css/amazeui.css" rel="stylesheet" type="text/css">

    <link href="../css/personal.css" rel="stylesheet" type="text/css">
    <link href="../css/infstyle.css" rel="stylesheet" type="text/css">
    <script src="../AmazeUI-2.4.2/assets/js/jquery.min.js"></script>
    <script src="../AmazeUI-2.4.2/assets/js/amazeui.js"></script>
    <script src="../basic/js/axios.min.js"></script>
    <script src="../basic/js/vue.js"></script>
</head>

<body id="app">
<div id="myDiv">
    <!--头 -->
    <header>
        <article>
            <div class="mt-logo">
                <!--顶部导航条 -->
                <div class="am-container header">
                    <ul class="message-l">
                        <div class="topMessage">
                            <!--                            <div class="menu-hd">-->
                            <!--                                <a href="#" target="_top" class="h">亲，请登录</a>-->
                            <!--                                <a href="#" target="_top">免费注册</a>-->
                            <!--                            </div>-->
                            <div class="menu-hd">
							<span v-if="nickname != null">
								Hi!&nbsp;&nbsp;{{nickname}}&nbsp;&nbsp;&nbsp;&nbsp;
								<a href="/" @click="logout" target="_top">退出</a>
							</span>
                                <span v-else>
							<a href="../login.html" target="_top" class="h">亲，请登录</a>&nbsp;&nbsp;
							<a href="../register.html" target="_top">免费注册</a>
							</span>
                            </div>
                        </div>
                    </ul>
                    <ul class="message-r">
                        <div class="topMessage home">
                            <div class="menu-hd"><a href="../index.html" target="_top" class="h">商城首页</a></div>
                        </div>
                        <div class="topMessage my-shangcheng">
                            <div class="menu-hd MyShangcheng"><a href="../person/information.html" target="_top"><i
                                    class="am-icon-pet am-icon-fw"></i>个人中心</a></div>
                        </div>
                        <div class="topMessage mini-cart">
                            <div class="menu-hd"><a id="mc-menu-hd" href="shopcart.html" target="_top"><i
                                    class="am-icon-shopping-cart  am-icon-fw"></i><span>购物车</span><strong
                                    id="J_MiniCartNum" class="h">0</strong></a></div>
                        </div>
                        <div class="topMessage favorite">
                            <div class="menu-hd"><a href="#" target="_top"><i
                                    class="am-icon-heart am-icon-fw"></i><span>收藏夹</span></a></div>
                        </div>
                    </ul>
                </div>
                <!--悬浮搜索框-->

                <div class="nav white">
                    <div class="logoBig">
                        <li><img src="../images/logobig.png"/></li>
                    </div>

                    <div class="search-bar pr">
                        <a name="index_none_header_sysc" href="#"></a>
                        <form>
                            <input id="searchInput" name="index_none_header_sysc" type="text" placeholder="搜索"
                                   autocomplete="off" style="padding-left: 10px;font-size: 1.3em">
                            <input id="ai-topsearch" class="submit am-btn" value="搜索" index="1" type="submit">
                        </form>
                    </div>
                </div>
                <div class="clear"></div>
            </div>
        </article>
    </header>


    <div class="nav-table">
        <div class="long-title"><span class="all-goods">全部分类</span></div>
        <div class="nav-cont">
            <ul>
                <li class="index"><a href="../index.html" target="_blank">商城</a></li>
                <li class="qc"><a href="goods.html" target="_blank">所有商品</a></li>
                <li class="qc"><a href="#" style="background-color: black;color: white" target="_blank">加入我们</a></li>
                <li class="qc last"><a href="aboutUs.html" target="_blank">关于我们</a></li>
            </ul>
        </div>
    </div>
    <b class="line"></b>
    <div class="center">
        <div class="col-main">
            <div class="main-wrap" style="min-height: 450px">

                <div class="pet-info">
                    <!--个人信息 -->
                    <div class="info-main">
                        <form class="am-form am-form-horizontal" v-model="searchMasterMsg">

                            <div class="am-form-group" style="height: 90px;">
                                <label for="toKnow" class="am-form-label">用户须知：</label>
                                <div class="am-form-content" id="toKnow" style="text-indent:2em;margin-right: 58px">
                                    Get物App聚集了一大批热爱球鞋、潮品穿搭和潮流文化的爱好者，
                                    话题讨论集中在球鞋、潮牌、手办、街头文化、汽车腕表和时尚艺术等年轻人关注的热点话题。
                                    Get物App正在成为中国潮流文化发展的土壤。
                                    <br>
                                    <br>
                                    <div style="text-indent:2em;display: inline-block">
                                        加入我们需要向我们提供你的真实姓名及身份证号码以进行实名认证。
                                    </div>
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label for="pet-name" class="am-form-label">真实姓名：</label>
                                <div class="am-form-content">
                                    <input type="text" v-model="realMessage.realname" id="pet-name"
                                           placeholder="真实姓名">

                                </div>
                            </div>

                            <div class="am-form-group">
                                <label for="pet-age" class="am-form-label">身份证号：</label>
                                <div class="am-form-content">
                                    <input type="text" v-model="realMessage.idnum" id="pet-age" placeholder="身份证号码">
                                </div>
                            </div>

                            <!--private String address;-->
                            <div class="am-form-group">
<!--                                <div></div>-->
<!--                                <label for="suggestId" class="am-form-label">地址</label>-->
                                <div class="am-form-content" style="text-align: center;margin-left: 0">
                                    <input type="checkbox" id="checkRule" value="dddd" v-model="realMessage.rule">
                                    点击即代表你同意Get物《<a href="javascript:void(0)" style="border-bottom: 1px solid #9e9e9e">入驻协议</a>》
                                </div>
                            </div>

                            <div class="info-btn">
                                <div class="am-btn am-btn-danger" v-on:click="btnJoinUs"
                                     style="background-color: black;
                                     color: white;border: 2px solid black;border-radius: 5px;width: 80px;font-weight: bold">
                                    申请加入
                                </div>
                            </div>

                        </form>
                    </div>
                </div>
            </div>
            <!--底部-->
            <div class="footer">
                <div class="footer-hd">
                    <p>
                        <a href="#">恒望科技</a>
                        <b>|</b>
                        <a href="/">商城首页</a>
                        <b>|</b>
                        <a href="#">支付宝</a>
                        <b>|</b>
                        <a href="#">物流</a>
                    </p>
                </div>
                <div class="footer-bd">
                    <p>
                        <a href="#">关于恒望</a>
                        <a href="#">合作伙伴</a>
                        <a href="#">联系我们</a>
                        <a href="#">网站地图</a>
                        <em>© 2015-2025 Hengwang.com 版权所有. 更多模板 <a href="http://www.cssmoban.com/" target="_blank"
                                                                   title="模板之家">模板之家</a> - Collect from <a
                                href="http://www.cssmoban.com/" title="网页模板" target="_blank">网页模板</a></em>
                    </p>
                </div>
            </div>
        </div>
    </div>
    <div class="am-modal am-modal-no-btn" tabindex="-1" id="address-modal">
        <div class="am-modal-dialog">
            <div class="am-modal-hd">
                <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd">
                <input id="modelAdres" type="text" v-model="modalAdress" style="width: 680px;height: 30px;">
                <input style="height: 30px;" type="button" @click="confirmAdress" value="确定">
                <div id="mapDiv" style="width: 730px;height: 400px;">
                </div>
            </div>
        </div>
    </div>
</div>


</body>

<script type="text/javascript">
    Vue.createApp({
        setup() {
            const nickname = Vue.ref()
            const username = Vue.ref()
            const checkRealname = () => {
                return realMessage.realname != null && realMessage.realname !== '';
            }
            const checkIdnum = () => {
                return realMessage.idnum != null && realMessage.idnum !== '';
            }
            const btnJoinUs = () => {
                if (checkRealname()&&checkRealname()){
                    if (realMessage.rule){
                        if (realMessage.state === 1){
                            alert("请勿重复入驻提交申请")
                        }else if (realMessage.state === 2){
                            alert("您已是入驻成员，请勿重复入驻")
                        }else {
                            axios({
                                url: "http://localhost:8080/user/joinUs",
                                method: "post",
                                data: realMessage,
                                headers: {
                                    "X-token": localStorage.getItem("token")
                                }
                            }).then(res => {
                                if (res.data.success) {
                                    alert("您的申请已提交，等待客服同意后即为加入成功")
                                } else {
                                    alert("申请失败")
                                }
                            }).catch(e => {
                                alert("加入失败，可能是网络问题所导致")
                            })
                        }
                    }else {
                        alert("请先同意《入驻协议》")
                    }
                }else {
                    alert("信息填写不完整")
                }

            }
            const realMessage = Vue.reactive({
                id: '',
                realname: '',
                idnum: '',
                rule: false,
                state: '',
            })
            const getByUsername = () => {
                axios({
                    url: "http://localhost:8080/user/getByUsername",
                    method: "get",
                    params: {
                        username: localStorage.getItem("username")
                    }
                }).then(res => {
                    if (res.data.success) {
                        realMessage.id = res.data.data.id
                        realMessage.state = res.data.data.state
                    } else {
                        alert(res.data.msg);
                    }
                }).catch(e => {
                    alert("网络错误" + e.message)
                    location.href = "../index.html"
                })
            }
            const logout = () => {
                localStorage.clear()
            }
            Vue.onMounted(()=>{
                if (localStorage.getItem("token") !== null) {
                    username.value = localStorage.getItem("username")
                    nickname.value = localStorage.getItem("nickname")
                }else {
                    location.href="../login.html"
                }
                getByUsername()
            })
            return {
                btnJoinUs,
                realMessage,
                nickname,
                username,
                logout,
                checkRealname,
                checkIdnum,
            }
        }
    }).mount("#app")
</script>

</html>
